<template>
  <div class="viewcontainer">
    <el-form :model="formData" label-width="100px" class="demo-form-inline">
      <el-row>
        <el-col :span="12">
          <el-form-item :label="$t('system.roleId')">
            <el-input v-model="formData.id"  :disabled="stat!='add'" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('system.roleName')">
            <el-input v-model="formData.name"  />
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item :label="$t('common.note')">
        <el-input v-model="formData.note" type="textarea" />
      </el-form-item>
    </el-form>
    <el-row>
      <el-col :span="24">
        <div class="actionbar" style="margin: 0 auto;">
          <el-button type="primary" @click="save">{{$t("common.save")}}</el-button>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import dataHelper from "@/utils/dataHelper";
import string from "@/utils/string";
import baseView from "@/views/base";
export default {
  name: "system_role_detail",
  components: {},
  extends: baseView,
  model: {
    prop: "value",
    event: "valuechange",
  },
  props: {
    value: {
      type: Object,
    },
  },
  data() {
    return {
      formData: {},
      rawData: {},
      funcPath: this.$route.path,
      modelPath: "system/role.entity",
      stat: "add", //add edit
    };
  },

  computed: {},
  watch: {},
  methods: {
    save() {
      let saveHelper = new dataHelper.saveHelper(this.funcPath, this.modelPath);
      if (this.stat == "add") {
        this.formData.createdate = new Date();
        saveHelper.add(this.formData);
      } else saveHelper.update(this.rawData, this.formData);
      saveHelper.save().then((res) => {
        this.$message({
          message: this.$t("common.saveSucc"),
          type: "success",
        });
        this.rawData = _.cloneDeep(this.formData);
        if (this.stat == "add") {
          let view = this.close('system_role_list');
          if (view)
            view.refreshData();
        }
      });
    },
  },
  mounted() {
    let id = this.$route.query.id;

    if (id) {
      if (!this.askPermission("system_role_detail"))
        this.$router.push({ path: "/404" });
      this.stat = "edit";
      dataHelper.queryHelper
        .query(this.funcPath, this.modelPath, { id: id })
        .then((res) => {
          if (res.data.rows.length > 0) {
            this.formData = res.data.rows[0];
            this.rawData = _.cloneDeep(this.formData);
          }
        });
    } else {
      if (!this.askPermission("system_role_add"))
        this.$router.push({ path: "/404" });
    }
  },
};
</script>
<style rel="stylesheet/scss" lang="scss" scope>
</style>

